if (!com) var com = {}
if (!com.logicpartners) com.logicpartners = {}
if (!com.logicpartners.designerTools) com.logicpartners.designerTools = {}

com.logicpartners.designerTools.rectangle = function () {
  var self = this
  this.counter = 1
  this.button = $('<div></div>')
    .addClass('designerToolbarRectangle designerToolbarButton')
    .attr('title', 'Rectangle')
    .append($('<div></div>'))
  this.object = function (x, y, width, height) {
    this.toolName = 'rectangle'
    this.props = {
      type: { label: '类型', default: '矩形' },
      name: { label: '元素', default: 'Rectangle ' + self.counter++ },
      style: {
        label: '填充',
        default: 'nofill',
        options: [
          { label: '是', value: 'fill' },
          { label: '否', value: 'nofill' },
        ],
      },
      x: { label: '起始位置x(mm)', default: x },
      y: { label: '起始位置y(mm)', default: y },
      width: { label: '宽度(mm)', default: width },
      height: { label: '高度(mm)', default: height },
      lineWidth: { label: '边框宽度(mm)', default: 0.2 },
      ZindexTop: { label: '置顶', button: '置顶' },
      ZindexBottom: { label: '置底', button: '置底' },
      ZindexUp: { label: '上移一层', button: '上移一层' },
      ZindexDown: { label: '下移一层', button: '下移一层' },
    }
    for (var prop in this.props) {
      this[prop] = this.props[prop].default
    }
    this.readonly = ['type', 'name']

    this.setWidth = function (width) {
      if (this.readonly && this.readonly.includes('width')) return
      this.width = precisionNumber(width)
    }

    this.getWidth = function () {
      return this.width
    }

    this.setHeight = function (height) {
      if (this.readonly && this.readonly.includes('height')) return
      this.height = precisionNumber(height)
    }

    this.getHeight = function () {
      return this.height
    }

    this.hitTest = function (coords) {
      return (
        coords.x >= this.x && coords.x <= this.x + this.width && coords.y >= this.y && coords.y <= this.y + this.height
      )
    }

    this.draw = function (context) {
      this.x = precisionNumber(this.x)
      this.y = precisionNumber(this.y)
      this.setWidth(this.width)
      this.setHeight(this.height)
      context.lineWidth = this.lineWidth
      if (this.style == 'fill') {
        context.fillRect(this.x, this.y, this.width, this.height)
      } else {
        context.strokeRect(this.x, this.y, this.width, this.height)
      }

      // var canvasParent = document.querySelector('canvas').parentNode
      // // var Allcontext = canvas.getContext('2d')
      // // 打印出context对象属性名或方法名
      // console.dir(canvasParent, 'canvasParent')
    }

    this.drawActive = function (context) {
      context.dashedStroke(this.x, this.y, this.x + this.width, this.y + this.height, [1, 0.5])
    }

    this.toZPL = function (labelwidth, labelheight) {
      var n = this.lineWidth
      if (this.style == 'fill') n = Math.min(this.width, this.height)
      return `^FO${this.x},${this.y}^GB${this.width},${this.height},${n}^FS`
    }
  }
}
